import React, { useCallback, useMemo, useState } from "react";
import Base from './base';

export default (props) => {
    const { property, view, pageAxis } = Base.getProps(props);
    const obj = useMemo(() => ({}), []);
    const [value, setValue] = useState(Base.getInitValue(property, obj));

    const clickAction = useCallback(() => {
        if (property.eventActionName) pageAxis.invokeEventAction(property.eventActionName, { property, view, pageAxis });
        else if (property.eventAction) pageAxis.invokeEventAction2(property.eventAction, { property, view, pageAxis });
    }, [property, view, pageAxis]);

    property.setValue = (v) => setValue(v);

    const { label, text, dataText, href, style } = property;
    let text2 = dataText;
    text2 = text || (label || text);
    if (property.isValue) text2 = value;

    return (<a onClick={clickAction} style={style} href={href}>{text2}</a>);
};